<include file="public@header" />
<link rel="stylesheet" type="text/css" href="__STATIC__/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="__STATIC__/layui/dist/layCascader.css">
</head>
<body>
    <div class="wrap">
        <ul class="nav nav-tabs">
            <li><a href="{:url('Shop/index')}">列表</a></li>
            <li class="active"><a href="{:url('Shop/add')}">添加</a></li>
        </ul>
        <form method="post" class="form-horizontal js-ajax-form margin-top-20 layui-form" action="{:url('Shop/add')}">
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>门店名称</label>
                <div class="col-md-6 col-sm-10">
                    <input type="text" class="form-control" name="name">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>Logo</label>
                <div class="col-md-6 col-sm-10">
                    <input type="hidden" name="logo[]" class="form-control" value="" id="logo">
                    <div>
                        <a href="javascript:uploadOneImage('上传图片','#logo');">
                            <img src="/themes/admin_default/public/assets/images/default-thumbnail.png" id="logo-preview" width="135" style="cursor: pointer">
                        </a>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>门店类型</label>
                <div class="col-md-6 col-sm-10">
                    <input id="category" name="category_id">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>门店地区</label>
                <div class="col-md-6 col-sm-10">
                    <input id="area" name="district_id">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>门店地址</label>
                <div class="col-md-6 col-sm-10">
                    <input type="text" class="form-control" name="address">
                    <a onclick="doSelectLocation(this)">选择地址</a>
                    <input type="hidden" name="lat">
                    <input type="hidden" name="lng">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>店内环境</label>
                <div class="col-md-6 col-sm-10">
                    <ul id="photos" class="pic-list list-unstyled form-inline"></ul>
                    <a href="javascript:uploadMultiImage('图片上传','#photos','photos-item-tpl');" class="btn btn-default">选择图片</a>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>联系人</label>
                <div class="col-md-6 col-sm-10">
                    <input type="text" class="form-control" name="contacts">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>联系电话</label>
                <div class="col-md-6 col-sm-10">
                    <input type="text" class="form-control" name="contact_number">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>关联账号</label>
                <div class="col-md-6 col-sm-10">
                    <select name="user_id" lay-search="">
                        <option value="">请选择</option>
                        <foreach name="user_list" item="vo">
                            <option value="{$vo.id}">{$vo.mobile}</option>
                        </foreach>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label"><span class="form-required">*</span>营业执照</label>
                <div class="col-md-6 col-sm-10">
                    <input type="hidden" name="business_license[]" class="form-control" value="" id="business_license">
                    <div>
                        <a href="javascript:uploadOneImage('上传图片','#business_license');">
                            <img src="/themes/admin_default/public/assets/images/default-thumbnail.png" id="business_license-preview" width="135" style="cursor: pointer">
                        </a>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label" for="radio2">状态</label>
                <div class="col-md-8 col-sm-10">
                    <label class="radio-inline">
                        <input type="radio" name="status" value="1" checked="" lay-ignore>开启
                    </label>
                    <label class="radio-inline">
                        <input type="radio" name="status" value="0" lay-ignore>关闭
                    </label>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-primary js-ajax-submit">{:lang('ADD')}</button>
                </div>
            </div>
        </form>
    </div>
    <script src="__STATIC__/js/admin.js"></script>
    <script type="text/javascript" src="__STATIC__/layui/layui.js"></script>
    <script type="text/html" id="photos-item-tpl">
        <li id="saved-image{id}">
            <input id="photo-{id}" type="hidden" name="images[]" value="{filepath}">
            <input class="form-control" id="photo-{id}-name" type="hidden" name="photo_names[]" value="{name}" style="width: 200px;" title="图片名称">
            <img id="photo-{id}-preview" src="{url}" style="height:80px;width: 80px;"
                 onclick="imagePreviewDialog(this.src);">
            <a class="btn btn-default" href="javascript:uploadOneImage('图片上传','#photo-{id}');"><i class="fa fa-upload fa-fw"></i></a>
            <a class="btn btn-danger" href="javascript:(function(){$('#saved-image{id}').remove();})();"><i class="fa fa-trash fa-fw"></i></a>
            <a class="btn btn-success" href="javascript:(function(){$('#saved-image{id}').before($('#saved-image{id}').next());})();"><i class="fa fa-arrow-down fa-fw"></i></a>
        </li>
    </script>
    <script type="text/javascript">
    function doSelectLocation(obj) {
        var $obj       = $(obj);
        var title      = $obj.data('title');
        var $realInput = $obj;
        var location   = $realInput.val();

        openIframeLayer(
            "{:url('Shop/map')}?location=" + location,
            '选择定位',
            {
                area: ['700px', '90%'],
            }
        );
    }

    layui.config({
            base: '__STATIC__/layui/dist/'
        }).use(['element', 'code', 'layCascader', 'layer', 'jquery','form'], function () {
            var layer = layui.layer;
            var form = layui.form;
            var $ = layui.jquery;
            var layCascader = layui.layCascader;

            var options = {$areaTree};

            layCascader({
                elem: '#area',
                clearable: true,
                filterable: true,
                options: options,
            });

            var categoryTree = {$categoryTree};
            layCascader({
                elem: '#category',
                clearable: true,
                filterable: true,
                options: categoryTree
            });

            $('form').on('keypress', function(e) {
                if(e.keyCode === 13) {
                    return false;
                }
            });
        });
    </script>
</body>
</html>